<template>
    <div class="app-container">
        <el-form label-width="80px">

            <el-form-item label="ID">
                <el-input v-model="role.id" disabled></el-input>
            </el-form-item>
            <el-form-item label="名称">
                <el-input v-model="role.name"></el-input>
            </el-form-item>
            <el-form-item label="备注">
                <el-input v-model="role.remark"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="edit()">编辑</el-button>
                <el-button @click="back()">返回</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import {Message, MessageBox} from 'element-ui'
    import roleApi from '../../api/role'


    export default {
        name: "role-manager-edit",
        props:['roleId'],
        data:function () {
            return {
                role:{
                    id:-1,
                    name:'',
                    remark:''
                }
            }
        },
        methods:{
            edit:function () {
                roleApi.edit(this.role)
                    .then(function (data) {
                        if (data.success){
                            Message.success('编辑成功')
                            return
                        }
                        Message.error('编辑失败')
                    }).catch(function () {
                        Message.error('编辑失败')
                    })
            },
            back:function () {
                this.$router.back(-1)
            }
        },
        mounted:function () {
            const _this = this;
            this.role.id = this.roleId;
            roleApi.findById(this.role.id)
                .then(function (data) {
                    _this.role = data;
                })
        }


    }
</script>

<style scoped>

</style>
